import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  //存储应用中的数据，可以通过组件访问或修改，类似与组件中的data，所有的组件都可以访问
  //定义在state中的数据是全局共享的
  state: {
    uname: ''
  },
  //类似于vue的computed属性，允许从state中派生出一些状态，用于将数据进行处理后返回
  getters: {
    getUname(state){
      return state.uname.substring(0,3)
    }
  },
  //更改 Vuex 的 store 中的状态的唯一方法是提交 mutation。
  mutations: {
    setUname(state, payload) {
      state.uname = payload.uname;
    }
  },
  actions: {
    setUserName(context, payload) {
      context.commit('setUname', payload)
    }
  },
  modules: {
  }
})
